<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./dsp.js"></script>		
		<script src="./echarts.min.js"></script>
	</head>
	<body>
		<button onclick="echartManager2.startUpdate(20,true);soc.subscribe({content:'1:1'});">开始</button>
		<button onclick="echartManager2.stopUpdate()">停止</button>
		<div id="ech" style="width:100%;height: 200px;"></div>
		<div id="ech2" style="width:100%;height: 200px;"></div>
		<div id="ech3" style="width:100%;height: 200px;"></div>
		<div id="ech4" style="width:100%;height: 200px;"></div>
		<div id="ech5" style="width:100%;height: 200px;"></div>
		<div id="ech6" style="width:100%;height: 200px;"></div>
		<div id="ech7" style="width:100%;height: 200px;"></div>
		<div id="ech8" style="width:100%;height: 200px;"></div>
	</body>
</html>
<script type="module">
	import {TDCache,echartManager,workerManager} from "./signal.js";	
	let fs=100000;//采样频率	
	let echartObjs=[
		echarts.init(document.getElementById('ech')),
		echarts.init(document.getElementById('ech2')),
		echarts.init(document.getElementById('ech3')),
		echarts.init(document.getElementById('ech4')),
		echarts.init(document.getElementById('ech5')),
		echarts.init(document.getElementById('ech6')),
		echarts.init(document.getElementById('ech7')),
		echarts.init(document.getElementById('ech8'))
	];
	echartObjs.forEach(v=>{
		v.setOption({
			xAxis: {type: 'category',boundaryGap: false,data:[]},
			yAxis:{type:'value'},
			grid:{top:20,bottom:20},
			tooltip: {
				trigger: 'axis',
				transitionDuration: 0,
				axisPointer:{
					animation:false
				}
			},
			animation:false,
			series:[{type:'line',data:[],symbol: 'none',emphasis:{disabled:true}}],
		});
	});
		
	let channelDataCache=TDCache(fs,1,8);
	window.echartManager2=echartManager(channelDataCache);
	echartManager2.add(echartObjs[0],1);
	echartManager2.add(echartObjs[1],2);	
	echartManager2.add(echartObjs[2],3);
	echartManager2.add(echartObjs[3],4);
	/* echartManager2.add(echartObjs[4],5);
	echartManager2.add(echartObjs[5],6);
	echartManager2.add(echartObjs[6],7);
	echartManager2.add(echartObjs[7],8); */
	
	
	let start=Date.now();
	let worker=workerManager();
	worker.open('test',"ws://192.168.0.164:8088",message).then(r=>{
		if(r){
			window.soc=r;
		}else{
			console.log('连接失败');
		}
	});
	
	//消息回调
	function message(data){
		window.dataCount+=data.length;
		let xAxis=new Array(data.length).fill(Date.now()-start);
		let t=Date.now();
		channelDataCache.getChannel(1).insert(data,xAxis);
		channelDataCache.getChannel(2).insert(data,xAxis);
		channelDataCache.getChannel(3).insert(data,xAxis);
		channelDataCache.getChannel(4).insert(data,xAxis);
		channelDataCache.getChannel(5).insert(data,xAxis);
		channelDataCache.getChannel(6).insert(data,xAxis);
		channelDataCache.getChannel(7).insert(data,xAxis);
		channelDataCache.getChannel(8).insert(data,xAxis);		
		let t2=Date.now()-t;
		if(t2>50)console.log('插入',t2);
	}
</script>